/*mystyle.css*/
/*左间距*/
.margin-left-1{
    margin-left: 10px;
}
.margin-left-2{
    margin-left: 20px;
}
.margin-left-3{
    margin-left: 30px;
}
.margin-left-4{
    margin-left: 40px;
}
.margin-left-5{
    margin-left: 50px;
}

/*右间距*/
.margin-right-1{
    margin-right: 10px;
}
.margin-right-2{
    margin-right: 20px;
}
.margin-right-3{
    margin-right: 30px;
}
.margin-right-4{
    margin-right: 40px;
}
.margin-right-5{
    margin-right: 50px;
}

/*上间距*/
.margin-top-1{
    margin-top: 10px;
}
.margin-top-1-5{
    margin-top: 15px;
}
.margin-top-2{
    margin-top: 20px;
}
.margin-top-3{
    margin-top: 30px;
}
.margin-top-4{
    margin-top: 40px;
}
.margin-top-5{
    margin-top: 50px;
}

.padding-top-2{
    padding-top: 20px;
}

/*flex布局*/
.flex-row-between{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.flex-row-center {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.flex-row-flex-end {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}
.flex-row-around{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

.flex-column-between{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.flex-column-center{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.flex-column-around{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.flex-row-between-align-items{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.flex-column-align-items{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}